<template>
  <div class="container">
    <el-card>
      <el-form
        ref="form"
        :rules="$rules"
        :model="model"
        status-icon
        label-width="170px"
        class=""
      >
        <el-form-item
          prop="SignatureRate"
          :label="$language.local('SignatureRate')"
        >
          <xy-rate v-model="model.SignatureRate"></xy-rate>
        </el-form-item>
        <el-form-item
          prop="MSignstatus"
          :label="$language.local('MSignstatus')"
        >
          <el-switch
            v-model="model.MSignstatus"
            :active-value="1"
            :inactive-value="0"
          >
          </el-switch>
        </el-form-item>
        <el-form-item
          prop="verifybankcard"
          :label="$language.local('verifybankcard')"
        >
          <el-radio-group v-model="model.verifybankcard">
            <el-radio :label="1">阿里云认证</el-radio>
            <el-radio :label="2">完美签认证</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          prop="verifybankcardType"
          :label="$language.local('verifybankcardType')"
        >
          <el-select v-model="model.verifybankcardType">
            <el-option
              v-for="item in verifybankcardTypes"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="form-footer">
        <el-button type="primary" @click="onSubmit('form')">保存</el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      model: {
        // PayMaxAmount: 93500,
        // MonthAcceptanceMaxAmount: 2000000,
        // YearAcceptanceMaxAmount: 5000000,
      },
      api: "/api/systemSet",
      verifybankcardTypes: [
        {
          label: "启用公安二要素认证",
          value: 1,
        },
        {
          label: "启用运营商三要素认证",
          value: 2,
        },
        {
          label: "启用银行卡三要素认证",
          value: 3,
        },
        {
          label: "启用银行卡四要素认证",
          value: 4,
        },
      ],
    };
  },
  created() {
    this.getData();
  },
  methods: {
    async getData() {
      let response = await this.$http.get("/api/systemSet/GetModel/1?type=2");
      console.log(response);
      this.model = response.data.Data;
    },
    async onSubmit(formName) {
      let valided = await this.$refs[formName].validate().catch((err) => err);

      if (!valided) {
        return;
      }

      let response = await this.$http.post(
        "/api/systemSet/SignSet/1",
        null,
        this.model
      );
      if (response.data.Code == 200) {
        this.$message.success("修改成功");
      }
    },
  },
};
</script>

<style lang="less" scoped>
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  .el-card {
    width: 62%;
    padding: 2rem 4rem;
  }
}
</style>
